<template>
  <div class="main-info">
    <AdvancedForm
      ref="formRef"
      :items="mainForm"
      :initial-values="initialValues"
      :rules="formRules"
    >
      <template #secretLevel="{ form }">
        <secretLevelSelect
          v-model="form.secretLevel"
          style="width: 100%"
          :is-show-clear-tip="true"
          :allow-clear="true"
          :disabled="!!props.formInfo.id"
          :default-value="form.secretLevel"
          @change="levelChange"
        />
      </template>
      <!-- 合同号 -->
      <template #orderNo="{ form }">
        <inputModal
          v-if="!props.formInfo.id"
          v-model="form.orderNo"
          :label-value="form.orderNo"
          value-name="contractCode"
          label-name="contractCode"
          :query-fit-secret-level-keys="['agencySupplierCode', 'materialCode']"
          title="合同号"
          :show-tips="!form.secretLevel ? '请先选择密级！' : ''"
          type="contract"
          :default-query="{
            secretLevel: form.secretLevel,
          }"
          @handle-ok="orderNoChange"
          @change="changeValidate('orderNo')"
        />
        <a-input v-else v-model="form.orderNo" placeholder="请输入" disabled />
      </template>
      <!-- 供应商编码 -->
      <template #mdsVendorCode="{ form }">
        <inputModal
          v-if="!form.orderNo"
          v-model="form.mdsVendorCode"
          :label-value="form.mdsVendorCode"
          value-name="supplierCode"
          label-name="supplierCode"
          title="供应商编码"
          :show-tips="!form.secretLevel ? '请先选择密级！' : ''"
          :default-query="{
            secretLevel: form.secretLevel,
          }"
          type="supplyName"
          @handle-ok="mdsVendorChange"
          @hander-clear="mdsVendorClear"
        />
        <a-input
          v-else
          v-model="form.mdsVendorCode"
          placeholder="请输入"
          disabled
        />
      </template>
      <!-- 供应商联系人 -->
      <template #vendorLinkManName="{ form }">
        <inputModal
          v-model="form.vendorLinkManName"
          :label-value="form.vendorLinkManName"
          value-name="contacts"
          label-name="contacts"
          :show-tips="!form.mdsVendorCode ? '请先选择供应商' : ''"
          title="供应商联系人"
          type="supplyPerson"
          :default-query="{
            supplierCode: form.mdsVendorCode,
            secretLevel: form.secretLevel,
          }"
          @handle-ok="vendorLinkManChange"
          @hander-clear="vendorLinkManClear"
        />
      </template>
      <!-- 机型 -->
      <template #proMdsItemName="{ form }">
        <inputModal
          v-model="form.proMdsItemName"
          :label-value="form.proMdsItemName"
          value-name="materialName"
          label-name="materialName"
          title="机型"
          type="machineType"
          :show-tips="!form.secretLevel ? '请先选择密级！' : ''"
          :default-query="{
            materialType: '6',
            materialStatus: '1,3',
            secretLevel: form.secretLevel,
          }"
          @handle-ok="proMdsItemChange"
          @hander-clear="proMdsItemClear"
        />
      </template>
      <!-- 订单模板 -->
      <template #mdsTempletName="{ form }">
        <inputModal
          v-model="form.mdsTempletName"
          :label-value="form.mdsTempletName"
          value-name="templateName"
          label-name="templateName"
          title="订单模板"
          :show-tips="!form.secretLevel ? '请先选择密级！' : ''"
          type="orderTemp"
          :default-query="{
            confType: '2',
            secretLevel: form.secretLevel,
          }"
          @handle-ok="mdsTempletChange"
          @hander-clear="mdsTempletClear"
          @change="changeValidate('mdsTempletName')"
        />
      </template>
      <!-- 合同类型 -->
      <template #contractCategoDisplay="{ form }">
        <contractInput
          v-if="!form.orderNo"
          v-model="form.contractCategoDisplay"
          :label-value="contractCategoDisplayName"
          @handle-ok="contractCategohandleOk"
          @hander-clear="contractCategoClear"
        />
        <a-input
          v-else
          v-model="contractCategoDisplayName"
          placeholder="请输入"
          disabled
        />
      </template>
      <!-- 任务编号 -->
      <template #missionNo="{ form }">
        <inputModal
          v-model="form.missionNo"
          :label-value="form.missionNo"
          :value-name="'taskNum'"
          :label-name="'taskNum'"
          :title="'任务编号'"
          :type="'missionNo'"
          @change="changeValidate('missionNo')"
        />
      </template>
    </AdvancedForm>
  </div>
</template>

<script setup lang="ts">
  import { ref, defineProps, watch, nextTick } from 'vue';
  import AdvancedForm from '@/common/components/cac-components/advanced-forms/index.vue';
  import secretLevelSelect from '@/common/components/cac-components/secret-level-select/index.vue';
  import inputModal from '@/common/components/search-modal/input-modal.vue';
  // import { Message } from '@arco-design/web-vue';
  import contractInput from '../com/input-modal-type.vue';
  // import searchItem from '@/common/components/search-modal/index.vue';
  import { mainForm, mainFormRules } from './config';

  const props = defineProps({
    formInfo: {
      type: Object,
      default: null,
    },
  });
  const formRules = ref({});
  const formRef = ref();
  nextTick(() => {
    formRules.value = mainFormRules(formRef.value.form);
  });
  const initialValues = ref({});
  const aterParam = ref<any>({
    contractDesc: '', // 合同名称
    pmsLongtermAgreementId: '', // 合同id
    mdsCatagoryLv1Code: '', // 一级品类code
    mdsCatagoryLv1Id: '',
    mdsTempletCode: '', // 订单模板code
    mdsTempletId: '',
    proMdsItemCode: '', // 机型
    proMdsItemId: '',
  });
  const contractCategoDisplayName = ref('');
  // const name1 = ref('');
  const formValidate = () => {
    return formRef.value.formObject.validate();
  };
  const getFormDate = () => {
    return { ...formRef.value.form, ...aterParam.value };
  };
  // 密级变更
  const levelChange = () => {
    aterParam.value.contractDesc = '';
    aterParam.value.pmsLongtermAgreementId = '';
    // 供应商字段获取
    aterParam.value.mdsCatagoryLv1Code = '';
    aterParam.value.mdsCatagoryLv1Id = '';
    aterParam.value.mdsTempletCode = '';
    aterParam.value.mdsTempletId = '';
    aterParam.value.proMdsItemCode = '';
    aterParam.value.proMdsItemId = '';
    contractCategoDisplayName.value = '';
    const formData = formRef.value.form;
    formData.orderNo = '';
    formData.proMdsItemName = '';
    formData.mdsVendorName = '';
    formData.mdsVendorCode = '';
    formData.mdsTempletName = '';
    formData.contractCategoDisplay = '';
    formData.mdsCatagoryLv1Name = '';
    formData.vendorLinkPhoneNo = '';
    formData.vendorLinkFaxNo = '';
    formData.vendorLinkManName = '';
    formRef.value.setFormValues({ ...formData });
  };
  // 合同号选择或变更
  const orderNoChange = (row: any) => {
    console.log('1-----', row);
    aterParam.value.contractDesc = row.contractName;
    aterParam.value.pmsLongtermAgreementId = row.id;
    // 供应商字段获取
    aterParam.value.mdsCatagoryLv1Code = '';
    aterParam.value.mdsCatagoryLv1Id = '0';
    contractCategoDisplayName.value = row.contractClassifyName;

    const formData = formRef.value.form;
    formData.mdsVendorName = row.supplierName;
    formData.mdsVendorCode = row.agencySupplierCode;
    formData.contractCategoDisplay = row.contractClassifyId;
    formData.mdsCatagoryLv1Name = '生产采购';
    formRef.value.setFormValues({ ...formData });
  };
  // 供应商编码
  const mdsVendorChange = (row: any) => {
    const formData = formRef.value.form;
    formData.mdsVendorName = row.supplierChinese;
    formRef.value.setFormValues({ ...formData });
  };
  const mdsVendorClear = () => {
    const formData = formRef.value.form;
    formData.mdsVendorName = '';
    formRef.value.setFormValues({ ...formData });
  };
  // 合同类型
  const contractCategohandleOk = (row: any) => {
    console.log('1-----', row);
    aterParam.value.mdsCatagoryLv1Code = '';
    aterParam.value.mdsCatagoryLv1Id = '0';
    contractCategoDisplayName.value = row.classifyName;
    const formData = formRef.value.form;
    formData.mdsCatagoryLv1Name = '生产采购';
    formRef.value.setFormValues({ ...formData });
  };
  const contractCategoClear = () => {
    aterParam.value.mdsCatagoryLv1Code = '';
    aterParam.value.mdsCatagoryLv1Id = '';
    const formData = formRef.value.form;
    formData.mdsCatagoryLv1Name = '';
    formRef.value.setFormValues({ ...formData });
  };
  // 订单模板
  const mdsTempletChange = (row: any) => {
    console.log('1-----', row);
    aterParam.value.mdsTempletCode = row.templateCode;
    aterParam.value.mdsTempletId = row.id;
  };
  const mdsTempletClear = () => {
    aterParam.value.mdsTempletCode = '';
    aterParam.value.mdsTempletId = '';
  };
  // 机型
  const proMdsItemChange = (row: any) => {
    console.log('1-----', row);
    aterParam.value.proMdsItemCode = row.materialCode;
    aterParam.value.proMdsItemId = row.id;
  };
  const proMdsItemClear = () => {
    aterParam.value.proMdsItemCode = '';
    aterParam.value.proMdsItemId = '';
  };
  // 供应商联系人
  const vendorLinkManChange = (row: any) => {
    const formData = formRef.value.form;
    formData.vendorLinkPhoneNo = row.phonePrivate;
    formData.vendorLinkFaxNo = row.tax;
    formRef.value.setFormValues({ ...formData });
  };
  const vendorLinkManClear = () => {
    const formData = formRef.value.form;
    formData.vendorLinkPhoneNo = '';
    formData.vendorLinkFaxNo = '';
    formRef.value.setFormValues({ ...formData });
  };
  // const vendorLinkManTips = () => {
  //   Message.warning('请先选择供应商');
  // };
  const changeValidate = (item: string) => {
    nextTick(() => {
      formRef.value.formObject.validateField(item);
    });
  };
  watch(
    () => props.formInfo,
    async () => {
      if (props.formInfo) {
        await nextTick();
        formRef.value.setFormValues({ ...props.formInfo });
        contractCategoDisplayName.value =
          props.formInfo.contractCategoDisplayName;
        Object.keys(aterParam.value).forEach((key) => {
          aterParam.value[key] = props.formInfo[key] ? props.formInfo[key] : '';
        });
      }
    },
    {
      deep: true,
      immediate: true,
    }
  );
  defineExpose({
    formValidate,
    getFormDate,
  });
</script>

<style lang="less" scoped>
  .main-info {
    width: 100%;
    height: 100%;
    margin-top: 8px;

    :deep(.arco-collapse-item-content.arco-collapse-item-content-expend) {
      padding-left: 16px;
      background-color: #fff;
    }

    :deep(.arco-textarea) {
      height: 100% !important;
    }

    :deep(.arco-row) {
      width: unset !important;
    }
  }
</style>
